<template>
	<div class="Sidebar">
		<Menu :theme="theme2" :open-names="['1']" accordion class="menu" :style="{height:Sheight+'px'}">
			<div class="top">
			<h2>康姆链后台管理系统</h2>
		</div>
			<Submenu name="1">
				<template slot="title">
					<Icon type="ios-paper" /> 内容管理
				</template>
				<MenuItem name="1-1">文章管理</MenuItem>
				<MenuItem name="1-2">评论管理</MenuItem>
				<MenuItem name="1-3">举报管理</MenuItem>
			</Submenu>
			<Submenu name="2">
				<template slot="title">
					<Icon type="ios-people" /> 用户管理
				</template>
				<MenuItem name="2-1">新增用户</MenuItem>
				<MenuItem name="2-2">活跃用户</MenuItem>
			</Submenu>
			<Submenu name="3">
				<template slot="title">
					<Icon type="ios-stats" /> 统计分析
				</template>
				<MenuGroup title="使用">
					<MenuItem name="3-1">新增和启动</MenuItem>
					<MenuItem name="3-2">活跃分析</MenuItem>
					<MenuItem name="3-3">时段分析</MenuItem>
				</MenuGroup>
				<MenuGroup title="留存">
					<MenuItem name="3-4">用户留存</MenuItem>
					<MenuItem name="3-5">流失用户</MenuItem>
				</MenuGroup>
			</Submenu>
		</Menu>
	</div>
</template>

<script>
	export default {
		name: 'Sidebar',
		data() {
			return {
				theme2: 'dark',
				Sheight: document.documentElement.scrollHeight
			}
		}
	}
</script>

<style scoped>
	.sidebar {
		height: 100%;
		float: left;
	}
	.top{
		color: white;
		height: 100px;	
		line-height: 100px;
		text-align: center;
		border-bottom:1px solid rgba(255,255,255,.7);
	}
</style>